{% extends "base.html" %}
{% block title %}添加用户{% end %}
{% block content %}
<div class="pace  pace-inactive">
    <div class="pace-progress" data-progress-text="100%" data-progress="99" style="width: 100%;">
        <div class="pace-progress-inner"></div>
    </div>
    <div class="pace-activity"></div>
</div>
<div id="wrapper">
    {% include 'admin_nav.html' %}
    <div id="page-wrapper" class="gray-bg dashbard-1">
        <div class="row border-bottom">
            {% include 'header_nav.html' %}
        </div>
        <div class="row wrapper border-bottom white-bg page-heading">
            <div class="col-lg-10">
                <h2>添加用户</h2>
                <ol class="breadcrumb">
                    <li>
                        <a href="index.html">主页</a>
                    </li>
                    <li>
                        <a>表格</a>
                    </li>
                    <li>
                        <strong>添加用户</strong>
                    </li>
                </ol>
            </div>
            <div class="col-lg-2">

            </div>
        </div>
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5>

                            </h5>
                            <div class="ibox-tools">
                                <a class="collapse-link">
                                    <i class="fa fa-chevron-up"></i>
                                </a>


                                <a class="close-link">
                                    <i class="fa fa-times"></i>
                                </a>
                            </div>
                        </div>
                        <div class="ibox-content">
                            <style>
                                th:first-child,
                                .gradeX td:first-child {
                                    width: 20px;
                                    cursor: pointer;
                                }

                                th:first-child input,
                                .gradeX td:first-child input {
                                    cursor: pointer;
                                }
                            </style>

                            <!--<input type="text" id="username" name="username" onkeyup="keydownfun()"-->
                            <!--placeholder="4-16位字符，字母/中文/数字/下划线"/>-->
                            <!--<input type="password" id="pwd" name="pwd"-->
                            <!--onKeyUp="ps.update(this.value);"-->
                            <!--placeholder="6-20位字符，字母与数字组合"/>-->
                            <!--<input type="password" id="pwd2" name="pwd2" placeholder="请再次输入密码"/>-->
                            <!--<input type="text" id="phone" name="phone" maxlength="11"-->
                            <!--onkeyup="usertitle()"-->
                            <!--placeholder="请输入您的手机号完成验证"/>-->

                            <form method="post" id="form1" class="form-horizontal">
                                {% module xsrf_form_html() %}
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">用户名</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="不多于25个字" name="username"
                                               onkeyup="keydownfun()"  value="{{user.get('username','')}}" id="username">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">手机号</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="手机号" name="phone"
                                               onkeyup="usertitle()" maxlength="11" value="{{user.get('phone','')}}" id="phone">
                                    </div>
                                </div>
                                 <div class="form-group">
                                    <label class="col-sm-2 control-label">真实姓名</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="真实姓名" name="real_name"
                                               maxlength="11" value="{{user.get('real_name','')}}" id="real_name">
                                    </div>
                                </div>
                                 <div class="form-group">
                                    <label class="col-sm-2 control-label">身份证号</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="身份证号" name="id_code"
                                               maxlength="19" value="{{user.get('id_code','')}}" id="id_code">
                                    </div>
                                </div>
                                 <div class="form-group">
                                    <label class="col-sm-2 control-label">支付宝账号</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="支付宝账号" name="alipay"
                                               maxlength="19" value="{{user.get('alipay','')}}" id="alipay">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">级别</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="用户VIP级别，默认为0" name="level"
                                               value="{{user.get('level','')}}" id="level">
                                    </div>

                                </div>
                                 <div class="form-group">
                                    <label class="col-sm-2 control-label">激活币</label>

                                    <div class="col-sm-4">
                                        <input class="form-control"  name="money"
                                              value="{{user.get('money','')}}" id="money">
                                    </div>
                                 </div>
                                 <div class="form-group">
                                    <label class="col-sm-2 control-label">金币</label>

                                    <div class="col-sm-4">
                                        <input class="form-control" placeholder="金币" name="jinbi"
                                               value="{{user.get('jinbi','')}}" id="jinbi">
                                    </div>

                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">密码</label>

                                    <div class="col-sm-10">
                                        <input class="form-control" placeholder="密码,已设置可不填写" name="pwd"
                                               onKeyUp="ps.update(this.value);" value="" id="pwd">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <div class="col-sm-4 col-sm-offset-2">
                                        <button class="btn btn-primary project-fabu" type="submit">提交</button>
                                        <!--<button class="btn btn-white" type="submit">取消</button>-->
                                    </div>
                                </div>
                            </form>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    var arr = {};//装载每项资料的对错
    /*  用户名的验证*/
    function keydownfun() {
        var sttr = $("#username").val();
        var srr = checkusername(sttr, /^[a-zA-Z]{1}([a-zA-Z0-9]|[_]){3,19}$/);
        arr['username'] = false;
        if (sttr == "") {
            $("#rwdata1 #rwpic").html('');
            $("#rwdata1 #rwtxt").text("");
            return;
        }
        if (srr == false) {
            $("#username + span").html('<img src="/static/img/wrong.png"/>用户名格式不对');
        } else {
            $("#username + span").html('<img src="/static/img/rightPic.png"/>用户名格式正确');
        }
        if (sttr.length < 3) {
            $("#username + span").html('<img src="/static/img/wrong.png"/>用户名长度小于3');
        }
        else if (sttr.length > 20) {
            $("#username + span").html('<img src="/static/img/wrong.png"/>用户名长度大于20');
        }
    }
    function checkusername(str, pat) {
        var patrn = pat;
        if (!patrn.exec(str)) return false;
        return true;
    }
    /*密码验证1*/
    function psskeydown1() {
        var sttr = $("#pwd").val();
        var srr = checkusername(sttr, /^([a-zA-Z0-9]){5,19}$/);
        var pwd = '.pwdErrMsg';
        arr['pwd1'] = srr;
        if (sttr == "") {
            $("#pwd + span").html('');
            $("#pwd + span").text("");
            return;
        }
        if (srr == false) {
            $("#pwd + span").html('<img src="/static/img/wrong.png"/>密码格式错误');
            return;
        } else {
            $("#pwd + span").html('<img src="/static/img/rightPic.png"/>');
        }
        if (sttr.length < 6) {
            $("#pwd + span").html('<img src="/static/img/wrong.png"/>密码长度小于6');
        }
        else if (sttr.length > 20) {
            $("#pwd + span").html('<img src="/static/img/wrong.png"/>密码长度大于20');
        }
    }

    /*密码验证2*/
    function psskeydown2() {
        var sttr = $("#pwd2").val();
        if (arr['pwd1'] == false || sttr == "") {
            arr['pwd2'] = false;
            $("#pwd2 + span").html('');
            $("#pwd2 + span").text("");
            return;
        }
        if (sttr != $("#pwd").val()) {
            arr['pwd2'] = false;
            $("#pwd2 + span").html('<img src="/static/img/wrong.png"/>两次输入的密码不一致');
        } else {
            arr['pwd2'] = true;
            $("#pwd2 + span").html('<img src="/static/img/rightPic.png"/>');
        }
    }

    function usertitle() {
        var sttr = $("#username").val();
        var srr = checkusername(sttr, /^([u4e00-u9fa5]|[ufe30-uffa0]|[a-za-z0-9_]){3,12}$/);
        var sum = 0;
        arr['usertitle'] = false;
        if (sttr == "") {
            $("#pwd2 + span").html('');
        }
        for (var i = 0; i < sttr.length; i++) {
            var c = sttr.charCodeAt(i);
            if ((c >= 0x0001 && c <= 0x007e) || (0xff60 <= c && c <= 0xff9f)) {
                sum++;
            }
            else {
                sum += 2;
            }
        }
        if (sum < 4) {
            $("#pwd2 + span").html('<img src="/static/img/wrong.png"/>');
            $("#pwd2 + span").text("昵称长度小于4");
        }
        else if (sum > 14) {
            $("#pwd2 + span").html('<img src="/static/img/wrong.png"/>');
            $("#pwd2 + span").text("昵称长度大于14");
        } else {
            arr['usertitle'] = true;
            $("#pwd2 + span").html('<img src="/static/img/rightPic.png"/>');
            $("#pwd2 + span").text("昵称正确");
        }
    }

    $("#phone").keyup(function () {
        var mobile_number = $("#phone").val();
        var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;

        if (myreg.test(mobile_number)) {
            $("#phone + span").html('<img src="/static/img/rightPic.png"/>');
            $("#phone").focus();
        }
        else {
            $("#phone + span").html('<img src="/static/img/wrong.png"/>格式不正确，请检查');
        }
    });

    $("#pwd").focusout(function () {
        $("#pwd + span").html("");
        psskeydown1();
    });
    $("#pwd2").focusout(function () {
        $("#pwd2 + span").html("");
        psskeydown2();
    });

    $("#check_phone").click(function () {
        var phone = $("#phone").val();
        $.ajax({
            url: '/admin/check_phone?phone=' + phone,
            type: 'get',
            data: {},
            success: function (data) {
                var json = jQuery.parseJSON(data);
                if (json.status == 'error') {
                    alert("该手机号码用户已存在")
                }
                else {
                    $("#check_phone").text("检测通过")
                }

            },
            error: function () {
                alert('error');
            }
        });
    })
    $(document).ready(function () {
      //  GetNickName()
    })
    function GetNickName() {
        var rnd = "";
        var aaa = "";
        for (var i = 0; i < 7; i++)
            rnd += Math.floor(Math.random() * 10);
        aaa = "" + rnd;
        $("#UserID").val(aaa);
    }
</script>
{% end %}
